﻿@using IOA.MES.DataAccess.VModel
@model List<VModule>
@{
    var user = IOA.MES.Web.BaseEnv.User;
}
<!DOCTYPE html>

<html>
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <title>AISUN MES</title>
    <link rel="icon" href="/res/images/logo.png" />
    <link rel="stylesheet" href="/res/layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/res/layuiadmin/style/admin.css" media="all">
    <style>
        .layadmin-side-shrink .layui-layout-admin .layui-logo {
            background-image: url("/res/images/sjzg_icon.png");
            background-size: contain;
        }
    </style>
    <script src="~/res/vue/vue.min.js"></script>
</head>
<body layadmin-themealias="ocean-header">
    <div id="LAY_app">
        <div id="page"></div>
    </div>

    <template id="tplPage">
        <div class="layui-layout layui-layout-admin">
            <div class="layui-header">
                <!-- 头部区域 -->
                <ul class="layui-nav layui-layout-left">
                    <li class="layui-nav-item layadmin-flexible" lay-unselect>
                        <a href="javascript:;" layadmin-event="flexible" :title="lang.Home.Telescopic">
                            <i class="layui-icon layui-icon-shrink-right" id="LAY_app_flexible"></i>
                        </a>
                    </li>
                    <li class="layui-nav-item" lay-unselect>
                        <a href="javascript:;" layadmin-event="refresh" :title="lang.Home.Refresh">
                            <i class="layui-icon layui-icon-refresh-3"></i>
                        </a>
                    </li>
                </ul>
                <ul class="layui-nav layui-layout-right" lay-filter="layadmin-layout-right">
                    <li class="layui-nav-item layui-hide-xs" lay-unselect>
                        <a href="javascript:;" layadmin-event="theme">
                            <i class="layui-icon layui-icon-theme"></i>
                        </a>
                    </li>
                    <li class="layui-nav-item layui-hide-xs" lay-unselect>
                        <a href="javascript:;" layadmin-event="fullscreen">
                            <i class="layui-icon layui-icon-screen-full"></i>
                        </a>
                    </li>
                    <li class="layui-nav-item" lay-unselect>
                        <a href="javascript:;">
                            <cite style="margin-right:10px;">@user.TrueName</cite>
                        </a>
                        <dl class="layui-nav-child">
                            <dd><a style="text-align:center;" lay-href="/Settings/ModifyPassword">{{lang.Home.ChangePasword}}</a></dd>
                            <hr>
                            <dd style="text-align: center;"><a href="javascript:void(0)" @@click="reloadLang">{{lang.Home.ReloadLang}}</a></dd>
                            <hr>
                            <dd style="text-align: center;"><a href="/res/docs/Vina Solar Mes操作手册.pdf" target="_blank">{{lang.Home.OperationManual}}</a></dd>
                            <hr>
                            <dd style="text-align: center;"><a href="/res/docs/Vina Solar Mes错误代码解析.pdf" target="_blank">{{lang.Home.ErrCodes}}</a></dd>
                            <hr>
                            <dd style="text-align: center;"><a href="/res/docs/IOA.MES.WebTool.Setup.msi">{{lang.Home.DonwloadTools}}</a></dd>
                            <hr>
                            <dd style="text-align: center;"><a href="/Auth/Login" @@click="logout">{{lang.Home.Logout}}</a></dd>
                        </dl>
                    </li>
                </ul>
            </div>
            <!-- 侧边菜单 -->
            <div class="layui-side layui-side-menu">
                <div class="layui-side-scroll">
                    <div class="layui-logo">
                        <span>MES-AISUN</span>
                    </div>
                    <ul class="layui-nav layui-nav-tree" lay-shrink="all" id="LAY-system-side-menu" lay-filter="layadmin-system-side-menu">
                        <li :data-name="lang.Home.HomePage" class="layui-nav-item">
                            <a href="javascript:;" :lay-tips="lang.Home.HomePage" lay-direction="2" lay-href='/Home/FstPage'>
                                <i class="layui-icon layui-icon-home"></i>
                                <p>首页</p>
                            </a>
                        </li>
                        @foreach (var fstModule in Model)
                        {
                            <li data-name="@fstModule.DisplayTitle" class="layui-nav-item">
                                <a href="javascript:;" lay-tips="@fstModule.DisplayTitle" lay-direction="2" @(string.IsNullOrWhiteSpace(fstModule.Url) ? "" : $" lay-href='{fstModule.Url}'")>
                                    <i class="layui-icon layui-icon-@fstModule.Icon"></i>
                                    <p>@Html.Raw(fstModule.DisplayTitle)</p>
                                </a>
                                @if (fstModule.SubModules.Any())
                                {
                                    <dl class="layui-nav-child">
                                        @foreach (var secModule in fstModule.SubModules)
                                        {
                                            <dd data-name="@secModule.DisplayTitle">
                                                <a @Html.Raw(string.IsNullOrWhiteSpace(secModule.Url) ? "href=\"javascript:;\"" : $"lay-href={secModule.Url}")>@Html.Raw(secModule.DisplayTitle)</a>
                                                @if (secModule.SubModules.Any())
                                                {
                                                    <dl class="layui-nav-child">
                                                        @foreach (var thdModule in secModule.SubModules)
                                                        {
                                                            <dd data-name="@thdModule.DisplayTitle"><a lay-href="@thdModule.Url">@Html.Raw(thdModule.DisplayTitle)</a></dd>
                                                        }
                                                    </dl>
                                                }
                                            </dd>
                                        }
                                    </dl>
                                }
                            </li>
                        }
                    </ul>
                </div>
            </div>

            <!-- 页面标签 -->
            <div class="layadmin-pagetabs" id="LAY_app_tabs">
                <div class="layui-icon layadmin-tabs-control layui-icon-prev" layadmin-event="leftPage"></div>
                <div class="layui-icon layadmin-tabs-control layui-icon-next" layadmin-event="rightPage"></div>
                <div class="layui-icon layadmin-tabs-control layui-icon-down">
                    <ul class="layui-nav layadmin-tabs-select" lay-filter="layadmin-pagetabs-nav">
                        <li class="layui-nav-item" lay-unselect>
                            <a href="javascript:;"></a>
                            <dl class="layui-nav-child layui-anim-fadein">
                                <dd layadmin-event="closeThisTabs"><a href="javascript:;">{{lang.Home.CloseCurrentPage}}</a></dd>
                                <dd layadmin-event="closeOtherTabs"><a href="javascript:;">{{lang.Home.CloseOtherPages}}</a></dd>
                                <dd layadmin-event="closeAllTabs"><a href="javascript:;">{{lang.Home.CloseAllPages}}</a></dd>
                            </dl>
                        </li>
                    </ul>
                </div>
                <div class="layui-tab" lay-unauto lay-allowClose="true" lay-filter="layadmin-layout-tabs">
                    <ul class="layui-tab-title" id="LAY_app_tabsheader">
                        <li lay-id="/Home/FstPage" lay-attr="/Home/FstPage" class="layui-this"><i class="layui-icon layui-icon-home"></i></li>
                    </ul>
                </div>
            </div>

            <!-- 主体内容 -->
            <div class="layui-body" id="LAY_app_body">
                <div class="layadmin-tabsbody-item layui-show">
                    <iframe src="/Home/FstPage" frameborder="0" class="layadmin-iframe"></iframe>
                </div>
            </div>

            <!-- 辅助元素，一般用于移动设备下遮罩 -->
            <div class="layadmin-body-shade" layadmin-event="shade"></div>
        </div>
    </template>

    <script src="/res/layuiadmin/layui/layui.js"></script>
    <script src="/res/jquery/jquery-1.10.2.min.js"></script>
    <script src="/res/jquery/js.cookie.js"></script>
    <script src="/res/preload/soundjs.min.js"></script>
    <script src="/res/preload/preloadjs.min.js"></script>
    <script>
        var lang = localStorage.getItem("lang");
        if (!lang) {
            location.href = "/Auth/Login";
        }
        var vm = new Vue({
            el: "#page",
            template: "#tplPage",
            data: {
                lang: JSON.parse(lang).package
            }
        });

        setTimeout(function () {
            initLayui();
        }, 50);

        function initLayui() {
            layui.config({
                base: '/res/layuiadmin/' //静态资源所在路径
            }).extend({
                index: 'lib/index' //主入口模块
            }).use('index');
        }

        function reloadLang() {
            var langName = JSON.parse(lang).name;
            console.log("选择语言包：" + langName);
            $.ajax({
                url: "/Auth/GetLang",
                type: "POST",
                data: {
                    lang: langName
                },
                dataType: "json",
                success: function (res) {
                    if (res.ErrCode != 200) {
                        layer.msg(res.ErrMsg, { icon: 1 });
                        return;
                    }
                    localStorage.setItem("lang", res.Data);
                    lang = res.Data;
                    if (vm) {
                        vm.$data.lang = JSON.parse(res.Data).package
                    }
                    layer.msg("重载成功！");
                }
            });
        }

        function logout() {
            $.ajax({
                url: "/Auth/Logout",
                type: "POST",
                dataType: "json",
                success: function (res) {
                    if (res.ErrCode != 200) {
                        layer.msg(res.ErrMsg, { icon: 1 });
                        return;
                    }
                }
            });
        }
    </script>

    <script type="text/javascript">
        preload = new createjs.LoadQueue(true);
        createjs.Sound.registerPlugins([createjs.HTMLAudioPlugin]);  // need this so it doesn't default to Web Audio
        preload.installPlugin(createjs.Sound);
        preload.loadManifest([
            { id: "0", src: "/res/audio/0.mp3" },
            { id: "1", src: "/res/audio/1.mp3" },
            { id: "2", src: "/res/audio/2.mp3" },
            { id: "3", src: "/res/audio/3.mp3" },
            { id: "4", src: "/res/audio/4.mp3" },
            { id: "5", src: "/res/audio/5.mp3" },
            { id: "6", src: "/res/audio/6.mp3" },
            { id: "7", src: "/res/audio/7.mp3" },
            { id: "8", src: "/res/audio/8.mp3" },
            { id: "9", src: "/res/audio/9.mp3" },
            { id: "10", src: "/res/audio/10.mp3" },
            { id: "no", src: "/res/audio/no.mp3" },
            { id: "block", src: "/res/audio/block.mp3" },
            { id: "hundred", src: "/res/audio/hundred.mp3" },
            { id: "new_pack", src: "/res/audio/new_pack.mp3" },
            { id: "pack", src: "/res/audio/pack.mp3" },
        ]);
        preload.on("complete", (event) => {
            console.log(event);
        });
    </script>

    <script type="text/javascript">
        var noSupportMessage = "请使用Chrome最新版浏览器！";
        var ws,
            connected = false;

        function appendMessage(message) {
            console.log(message);
            layui.layer.msg(message);
        }

        function connectSocketServer() {
            console.log("* Connecting to server ..<br/>");
            connect();
            var tInterval = setInterval(function () {
                if (!ws || !connected) {
                    connect();
                }
            }, 10000);

            var heartInterval = setInterval(function () {
                if (ws && connected) {
                    login();
                    console.log("心跳发送完成...");
                }
            }, 10000);
        }

        function init() {
            ws.onmessage = function (evt) {
                console.log("# " + evt.data);
            };

            ws.onopen = function () {
                connected = true;
                appendMessage('本地工具已连接！');
                login();
                console.log("登录完成");
            };

            ws.onclose = function () {
                if (connected) {
                    connected = false;
                    appendMessage('本地工具已断开连接！');
                }
            }
        }

        function connect() {
            var support = "MozWebSocket" in window ? 'MozWebSocket' : ("WebSocket" in window ? 'WebSocket' : null);
            if (support == null) {
                appendMessage("* " + noSupportMessage + "<br/>");
                return;
            }
            ws = new window[support]('ws://localhost:1001/');
            init();
        }

        function login() {
            var cookies = document.cookie.split(';');
            var tokenCookie = cookies.find(function (e) {
                return e.trim().indexOf("Token=") == 0;
            });
            if (tokenCookie == null) {
                layui.layer.msg("登录异常！");
                return;
            }
            sendMessage(JSON.stringify({
                Command: "Login",
                Body: {
                    Token: tokenCookie.split('=')[1].trim()
                }
            }));
        }

        function sendMessage(message) {
            if (ws && connected) {
                ws.send(message);
            }
        }

        function disconnectWebSocket() {
            if (ws) {
                ws.close();
            }
        }

        window.onload = function () {
            connectSocketServer();
        }

        function getConnectionStatus() {
            return connected;
        }
    </script>
</body>
</html>